<!DOCTYPE html>
<html lang="en">
<head>
    
    <meta charset="utf-8">
    <title>Global - Documentation</title>
    
    
    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <link type="text/css" rel="stylesheet" href="styles/prettify.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
    <script src="scripts/nav.js" defer></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>

<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
  <div class="navicon"></div>
</label>

<label for="nav-trigger" class="overlay"></label>

<nav >
    
    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-$ui_dv_my-dv-bar.html">$ui/dv/my-dv-bar</a></li><li><a href="module-$ui_dv_my-dv-box.html">$ui/dv/my-dv-box</a></li><li><a href="module-$ui_dv_my-dv-fill.html">$ui/dv/my-dv-fill</a></li><li><a href="module-$ui_dv_my-dv-geo.html">$ui/dv/my-dv-geo</a></li><li><a href="module-$ui_dv_my-dv-icon.html">$ui/dv/my-dv-icon</a></li><li><a href="module-$ui_dv_my-dv-indicator.html">$ui/dv/my-dv-indicator</a></li><li><a href="module-$ui_dv_my-dv-line.html">$ui/dv/my-dv-line</a></li><li><a href="module-$ui_dv_my-dv-loading.html">$ui/dv/my-dv-loading</a></li><li><a href="module-$ui_dv_my-dv-page.html">$ui/dv/my-dv-page</a></li><li><a href="module-$ui_dv_my-dv-pictorial.html">$ui/dv/my-dv-pictorial</a></li><li><a href="module-$ui_dv_my-dv-pie.html">$ui/dv/my-dv-pie</a></li><li><a href="module-$ui_dv_my-dv-progress.html">$ui/dv/my-dv-progress</a></li><li><a href="module-$ui_dv_my-dv-radar.html">$ui/dv/my-dv-radar</a></li><li><a href="module-$ui_dv_my-dv-rank.html">$ui/dv/my-dv-rank</a></li><li><a href="module-$ui_dv_my-dv-ring.html">$ui/dv/my-dv-ring</a></li><li></li><li><a href="module-$ui_dv_my-dv-screen.html">$ui/dv/my-dv-screen</a></li><li><a href="module-$ui_dv_my-dv-starry.html">$ui/dv/my-dv-starry</a></li><li><a href="module-$ui_dv_my-dv-text.html">$ui/dv/my-dv-text</a></li><li><a href="module-$ui_dv_my-dv-title.html">$ui/dv/my-dv-title</a></li></ul><h3>Global</h3><ul><li><a href="global.html#darken">darken</a></li><li><a href="global.html#fade">fade</a></li><li><a href="global.html#getCircleRadianPoint">getCircleRadianPoint</a></li><li><a href="global.html#getColorByKeyword">getColorByKeyword</a></li><li><a href="global.html#getColorFromRgbValue">getColorFromRgbValue</a></li><li><a href="global.html#getOpacity">getOpacity</a></li><li><a href="global.html#getRgbaValue">getRgbaValue</a></li><li><a href="global.html#getRgbValue">getRgbValue</a></li><li><a href="global.html#getRgbValueFromHex">getRgbValueFromHex</a></li><li><a href="global.html#getRgbValueFromRgb">getRgbValueFromRgb</a></li><li><a href="global.html#lighten">lighten</a></li><li><a href="global.html#props">props</a></li><li><a href="global.html#toHex">toHex</a></li><li><a href="global.html#toRgb">toRgb</a></li><li><a href="global.html#validator">validator</a></li></ul>
</nav>

<div id="main">
    
    <h1 class="page-title">Global</h1>
    

    




<section>

<header>
    
        <h2>
        
        </h2>
        
    
</header>

<article>
    
        <div class="container-overview">
        
            

<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>




            

            
        
        </div>
    

    

    

    
    
    

     

    

    
        <h3 class="subsection-title">Members</h3>

        
            
<h4 class="name" id="props"><span class="type-signature"></span>props<span class="type-signature"></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="mixins_Adorn.js.html">mixins/Adorn.js</a>, <a href="mixins_Adorn.js.html#line14">line 14</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>duration</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>动画持续时间，单位：秒</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>reverse</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>翻转 180度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>opacity</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>1</code>
                
                </td>
            

            <td class="description last"><p>透明度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>#1890FF</code>
                
                </td>
            

            <td class="description last"><p>颜色</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>属性参数</p>
</div>








        
            
<h4 class="name" id="props"><span class="type-signature"></span>props<span class="type-signature"></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="packages_my-dv-adorn1_Adorn1.vue.html">packages/my-dv-adorn1/Adorn1.vue</a>, <a href="packages_my-dv-adorn1_Adorn1.vue.html#line10">line 10</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>duration</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>动画持续时间，单位：秒</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>reverse</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>翻转 180度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>opacity</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>1</code>
                
                </td>
            

            <td class="description last"><p>透明度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>#1890FF</code>
                
                </td>
            

            <td class="description last"><p>颜色</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>size</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>5</code>
                
                </td>
            

            <td class="description last"><p>格子尺寸，单位：px</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>gap</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>5</code>
                
                </td>
            

            <td class="description last"><p>格子间距，单位: px</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>属性参数</p>
</div>








        
            
<h4 class="name" id="props"><span class="type-signature"></span>props<span class="type-signature"></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="packages_my-dv-adorn2_Adorn2.vue.html">packages/my-dv-adorn2/Adorn2.vue</a>, <a href="packages_my-dv-adorn2_Adorn2.vue.html#line10">line 10</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>duration</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>动画持续时间，单位：秒</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>reverse</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>翻转 180度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>opacity</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>1</code>
                
                </td>
            

            <td class="description last"><p>透明度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>#1890FF</code>
                
                </td>
            

            <td class="description last"><p>颜色</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>size</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>5</code>
                
                </td>
            

            <td class="description last"><p>线条的宽度，单位：px</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>属性参数</p>
</div>








        
            
<h4 class="name" id="props"><span class="type-signature"></span>props<span class="type-signature"></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="packages_my-dv-adorn3_Adorn3.vue.html">packages/my-dv-adorn3/Adorn3.vue</a>, <a href="packages_my-dv-adorn3_Adorn3.vue.html#line10">line 10</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>duration</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>动画持续时间，单位：秒</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>reverse</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>翻转 180度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>opacity</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>1</code>
                
                </td>
            

            <td class="description last"><p>透明度</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>#1890FF</code>
                
                </td>
            

            <td class="description last"><p>颜色</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>size</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>5</code>
                
                </td>
            

            <td class="description last"><p>格子尺寸，单位：px</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>size</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>5</code>
                
                </td>
            

            <td class="description last"><p>格子间距，单位：px</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>属性参数</p>
</div>








        
            
<h4 class="name" id="props"><span class="type-signature"></span>props<span class="type-signature"></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="packages_my-dv-list_List.vue.html">packages/my-dv-list/List.vue</a>, <a href="packages_my-dv-list_List.vue.html#line17">line 17</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>columns</code></td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;String></span>
|

<span class="param-type">Array.&lt;Object></span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>数据列</p>
                <h6>Properties</h6>

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>label</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            

            <td class="description last"><p>列头文本</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>prop</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            

            <td class="description last"><p>列名称，如果行是对象格式，必须要设置</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>width</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            

            <td class="description last"><p>列宽度</p></td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    

        <tr>
            
                <td class="name"><code>rows</code></td>
            

            <td class="type">
            
                
<span class="param-type">Array</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>数据行</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>header</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                    <code>true</code>
                
                </td>
            

            <td class="description last"><p>显示列头</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>border</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>显示边框</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>radius</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>显示圆角</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>scroll</code></td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type">Object</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>滚动配置</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>属性参数</p>
</div>








        
    

    
        <h3 class="subsection-title">Methods</h3>

        
            

    

    <h4 class="name" id="darken"><span class="type-signature"></span>darken<span class="signature">(color)</span><span class="type-signature"> &rarr; {Number|String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line180">line 180</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Deepen color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>
<ul>
        <li>
<div class="param-desc">
    <p>Percent of Deepen (1-100)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Number</span>


    </dd>
</dl>
</li>
    
        <li>
<div class="param-desc">
    <p>Rgba color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>
</li>
    </ul>



        
            

    

    <h4 class="name" id="fade"><span class="type-signature"></span>fade<span class="signature">(color, percent)</span><span class="type-signature"> &rarr; {String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line218">line 218</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Adjust color opacity</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>percent</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>of opacity</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Rgba color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getCircleRadianPoint"><span class="type-signature"></span>getCircleRadianPoint<span class="signature">(x, y, radius, radian)</span><span class="type-signature"> &rarr; {Array}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_util.js.html">utils/util.js</a>, <a href="utils_util.js.html#line40">line 40</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get the coordinates of the specified radian on the circle</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>x</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>Circle x coordinate</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>y</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>Circle y coordinate</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>radius</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>Circle radius</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>radian</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>Specfied radian</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Postion of point</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Array</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getColorByKeyword"><span class="type-signature"></span>getColorByKeyword<span class="signature">(keyword)</span><span class="type-signature"> &rarr; {String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line29">line 29</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get color by keyword</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>keyword</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Color keyword like red, green and etc.</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Hex or rgba color (Invalid keyword will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getColorFromRgbValue"><span class="type-signature"></span>getColorFromRgbValue<span class="signature">(value)</span><span class="type-signature"> &rarr; {String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line159">line 159</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get Color from Rgb|Rgba value</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>value</code></td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;Number></span>


            
            </td>

            

            

            <td class="description last"><p>Rgb|Rgba color value</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Rgb|Rgba color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getOpacity"><span class="type-signature"></span>getOpacity<span class="signature">(color)</span><span class="type-signature"> &rarr; {Number|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line104">line 104</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get the opacity of color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Color opacity (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Number</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getRgbaValue"><span class="type-signature"></span>getRgbaValue<span class="signature">(color)</span><span class="type-signature"> &rarr; {Array.&lt;Number>|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line87">line 87</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get the Rgba value of the color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Rgba value of the color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Array.&lt;Number></span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getRgbValue"><span class="type-signature"></span>getRgbValue<span class="signature">(color)</span><span class="type-signature"> &rarr; {Array.&lt;Number>|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line43">line 43</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get the Rgb value of the color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Rgb value of the color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Array.&lt;Number></span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getRgbValueFromHex"><span class="type-signature"></span>getRgbValueFromHex<span class="signature">(color)</span><span class="type-signature"> &rarr; {Array.&lt;Number>}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line62">line 62</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get the rgb value of the hex color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex color</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Rgb value of the color</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Array.&lt;Number></span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="getRgbValueFromRgb"><span class="type-signature"></span>getRgbValueFromRgb<span class="signature">(color)</span><span class="type-signature"> &rarr; {Array}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line74">line 74</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Get the rgb value of the rgb/rgba color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex color</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Rgb value of the color</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Array</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="lighten"><span class="type-signature"></span>lighten<span class="signature">(color)</span><span class="type-signature"> &rarr; {Number|String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line199">line 199</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Brighten color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>
<ul>
        <li>
<div class="param-desc">
    <p>Percent of brighten (1-100)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Number</span>


    </dd>
</dl>
</li>
    
        <li>
<div class="param-desc">
    <p>Rgba color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>
</li>
    </ul>



        
            

    

    <h4 class="name" id="toHex"><span class="type-signature"></span>toHex<span class="signature">(color)</span><span class="type-signature"> &rarr; {String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line140">line 140</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Convert color to Hex color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Hex color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="toRgb"><span class="type-signature"></span>toRgb<span class="signature">(color, opacity)</span><span class="type-signature"> &rarr; {String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line123">line 123</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Convert color to Rgb|Rgba color</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>opacity</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The opacity of color</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Rgb|Rgba color (Invalid input will return false)</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id="validator"><span class="type-signature"></span>validator<span class="signature">(color)</span><span class="type-signature"> &rarr; {String|Boolean}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="utils_color.js.html">utils/color.js</a>, <a href="utils_color.js.html#line12">line 12</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Color validator</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>color</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>Hex|Rgb|Rgba color or color keyword</p></td>
        </tr>

    
    </tbody>
</table>
















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>Valid color Or false</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>
|

<span class="param-type">Boolean</span>


    </dd>
</dl>

    



        
    

    

    
</article>

</section>





    
</div>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.6</a> on Tue Nov 17 2020 17:07:28 GMT+0800 (GMT+08:00) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
</footer>

<script>prettyPrint();</script>
<script src="scripts/polyfill.js"></script>
<script src="scripts/linenumber.js"></script>




<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?c4e5f73318b5cb0c389e3d9a05f831cc";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>

</body>
</html>